import { Suspense } from 'react'
import { Switch, Redirect, Route } from 'react-router-dom'

function RouterViews(props) {
  const { routerLists } = props;
  const routerRoutes = routerLists.filter((item) => {
    return !item.to
  })
  const redirects = routerLists.filter((item) => {
    return item.to
  })[0]
  return (
    <Suspense fallback={<b>loging...</b>}>
      <Switch>
        {
          routerRoutes && routerRoutes.length ? routerRoutes.map((router, index) => {
            return <Route key={index} path={router.path} render={(routerProps) => {
              if (router.children) {
                // console.log('router.children', router.children);
                return <router.component {...routerProps} child={router.children} names={router.children.filter((item) => {
                  return item.name
                })}></router.component>
              } else {
                return <router.component {...routerProps}></router.component>
              }
            }}></Route>
          }) : '暂无数据'
        },
        {
          redirects ? <Redirect from={redirects.from} to={redirects.to}></Redirect> : '暂无重定向数据'
        }
      </Switch>
    </Suspense>
  )
}
export default RouterViews